﻿<!-- ==============================================
HEADER
=============================================== -->
<header id="home" style="height: 735px;">

    <div class=" container text-center">

        <h1>TAAHA CHAUDHRY</h1>

        <p>Full Stack .NET Web Developer</p>

    </div>

</header><!--End header -->
<!-- ==============================================
ABOUT
=============================================== -->
<section id="about" class="add-padding bg-color2">

    <div class="container">

        <div class="row">

            <div class="col-sm-6 scrollimation fade-right d1">

                <img class="img-responsive polaroid" src="/App/Theme/assets/images/logo1.jpeg" style="height:400px;width:400px;" alt="" />

            </div>

            <div class="col-sm-6 scrollimation fade-left d3">

                <h1 class="big-text">I am <br />Taaha Chaudhry </h1>

                <p class="lead">I am Taaha Chaudhry, a full stack web developer from CA. Before moving to Austin, TX, I was focusing on getting my Computer Science, B.S. from the University of California, Irvine. Recently, I graduated from Coder Camps, a full stack web development bootcamp training “campers” in JavaScript and C#, along with Angular and the .NET framework. I occasionally also develop websites using Ruby on Rails.</p>

                <p>I am passionate about figuring out solutions to challenging problems with code. I want to be able to change the lives of people through coding, whether that's building surgical robots or finding simple fixes to everyday problems. Aside from coding, I love football and food.</p>

                <p>"Whether I like it or not, I have to think how can I change the world globally, because I am considered a privileged person."</p>
                <p>"Youth is too often wasted on the young."</p>

            </div>

        </div>

    </div>

</section>

<!-- Skills -->
<section id="services" class="add-padding" style="padding-top: 100px;padding-bottom: 100px;" ng-controller="app.LogInController">

    <div class=" container">
        <div class="section-title big-text scrollimation fade-up" style="margin-bottom: 20px;">
            <h1 class=" big-text" style="margin-top: 0px;margin-bottom: 0px;">
                My Skills
            </h1>

            <div class="form-inline" data-ng-show="token">
                <input type="text" class="form-control" placeholder="Enter Icon" data-ng-model="skill.Icon">
                <input type="text" class="form-control" placeholder="Enter Title" data-ng-model="skill.Title">
                <input type="text" class="form-control" placeholder="Enter Description" data-ng-model="skill.Description">
                <button type="button" class="btn btn-success btn-med" data-ng-click="AddSkill(skill)">add</button>
            </div>
        </div>


        <div class="row">

            <div class="col-sm-3 service-item color3 scale-in d2" ng-repeat="s in skills">

                <div class="service-icon"><img data-ng-src="{{s.Icon}}" style="width:100px" /></div>
                <div ng-hide="editing">
                    <h3>{{s.Title}}</h3>
                    <p>{{s.Description}}</p>
                </div>
                <div ng-show="editing">
                    <input class="form-control" type="text" ng-model="s.Icon" value="{{s.Icon}}" />
                    <input class="form-control" type="text" ng-model="s.Title" value="{{s.Title}}" />
                    <input class="form-control" type="text" ng-model="s.Description" value="{{s.Description}}" />
                </div>
                <div data-ng-show="token">
                    <div class="btn btn-success btn-sm" data-ng-show="editing" ng-click="editing='false'; EditSkill(s)">save</div>
                    <div class="btn btn-warning btn-sm" ng-hide="editing" ng-click="editing='true'">edit</div>
                    <div class="btn btn-danger btn-sm" ng-click="DeleteSkill(s)">delete</div>
                </div>
            </div>
        </div>
        <div class="row text-center">
            <button class="btn btn-light {{button.prev}}" ng-click="paginate(-1);">Prev.</button>
            <button class="btn btn-dark {{button.next}}" ng-click="paginate(1);">Next</button>
        </div>
    </div>

</section>

<!-- ==============================================
PORTFOLIO
=============================================== -->
<section id="portfolio" class="add-padding" ng-controller="app.LogInController">

    <div class="container">

        <h1 class="big-text text-center scrollimation fade-in">My Portfolio</h1>
        <div class="form-inline" data-ng-show="token">
            <input type="text" class="form-control" placeholder="Enter Title" data-ng-model="project.Title">
            <input type="text" class="form-control" placeholder="Enter Type" data-ng-model="project.Type">
            <input type="text" class="form-control" placeholder="Enter Repo Url" data-ng-model="project.RepoUrl">
            <input type="text" class="form-control" placeholder="Enter Site Url" data-ng-model="project.ProjectUrl">
            <input type="text" class="form-control" placeholder="Enter Image" data-ng-model="project.Image"><br />
            <textarea style="width: 360px; height: 54px;" class="form-control" data-ng-model="project.Description" placeholder="Enter Description"></textarea>
            <textarea style="width: 360px; height: 54px;" class="form-control" data-ng-model="project.TechStack" placeholder="Enter Tech Stack"></textarea>
            <button type="button" class="btn btn-success btn-med" data-ng-click="AddProject(project)">add</button>
        </div><br />
        <!--==== Portfolio Filters ====-->
        <div id="filter-works">

        </div><!--End portfolio filters -->
        <!--==== Project Preview ====-->
        <div id="project-preview">

            <span class="close-preview">&times;</span>

            <div id="project-slider" class="flexslider"></div>

            <h1 id="project-title"></h1>

            <div id="project-content"></div>

        </div><!--Project Preview -->

    </div>

    <div class="container masonry-wrapper">

        <div id="projects-container">

            <!-- ==============================================
            SINGLE PROJECT ITEM
            =============================================== -->
            <div ng-repeat="p in projects">
                <article class="project-item">

                    <img ng-hide="editingProject" style="height:230px; width:370px;" class="img-responsive project-image" src="{{p.Image}}" alt=""><!--Project thumb -->

                    <div ng-hide="editingProject" class="hover-mask" style="height:230px">
                        <h2 class="project-title">{{p.Title}}</h2><!--Project Title -->
                        <p>{{p.Type}}</p><!--Project Subtitle -->
                    </div>
                    <div style="overflow: auto; max-height:270px">
                        <input class="form-control" type="text" ng-show="editingProject" ng-model="p.Title" value="{{p.Title}}" />
                        <input class="form-control" type="text" ng-show="editingProject" ng-model="p.Type" value="{{p.Type}}" />
                        <input class="form-control" type="text" ng-show="editingProject" ng-model="p.RepoUrl" value="{{p.RepoUrl}}" />
                        <input class="form-control" type="text" ng-show="editingProject" ng-model="p.ProjectUrl" value="{{p.ProjectUrl}}" />
                        <input class="form-control" type="text" ng-show="editingProject" ng-model="p.Image" value="{{p.Image}}" />
                        <textarea class="form-control" ng-show="editingProject" data-ng-model="p.Description">{{p.Description}}</textarea>
                        <textarea class="form-control" ng-show="editingProject" data-ng-model="p.TechStack">{{p.TechStack}}</textarea>
                        <div data-ng-show="token">
                            <div class="btn btn-success btn-sm" data-ng-show="editingProject" ng-click="editingProject='false'; EditProject(p)">save</div>
                            <div class="btn btn-warning btn-sm" ng-hide="editingProject" ng-click="editingProject='true'">edit</div>
                            <div class="btn btn-danger btn-sm" data-ng-click="DeleteProject(p)">delete</div>
                        </div>
                    </div>
                    <!--==== Project Preview HTML ====-->

                    <div ng-hide="isLoggedIn" class="sr-only project-description" data-images="{{p.Image}}">

                        <p>{{p.Description}}</p>

                        <p>Tech Stack: {{p.TechStack}}</p>

                        <p class="text-center"><a class="btn btn-color1" href="{{p.RepoUrl}}"><i class="fa fa-arrow-right"></i>Code Repository</a></p>
                        <p class="text-center"><a class="btn btn-color1" href="{{p.ProjectUrl}}"><i class="fa fa-arrow-right"></i>Visit Website</a></p>

                    </div>

                </article>
            </div>
            <!-- ==============================================
            END PROJECT ITEM
            =============================================== -->

        </div><!-- End projects -->

    </div><!-- End container -->


</section>

<!-- ==============================================
TWITTER
=============================================== -->
<section id="twitter" class="add-padding bg-color1">

    <div class="container">
        <div class="row scrollimation fade-in">
            <div class="col-sm-1 twitter-icon">
                <i class="fa fa-twitter"></i>
            </div>
            <div class="col-sm-11">
                <div id="twitter-slider" class="flexslider" data-widget-id="345690956013633536" data-tweets-length="3"></div>
            </div>
        </div>
    </div>

</section>

<!-- ==============================================
CONTACT
=============================================== -->
<section id="contact" class="add-padding">

    <div class="container text-center">

        <div class="row">

            <div class="col-sm-6 col-md-5 text-right scrollimation fade-up d1">

                <h1 class="big-text">Contact Me</h1>

                <p class="lead">I am always looking for exiting opportunities and projects to work on! Feel free to shoot me a tweet or email!</p>

                <p>*Currently the contact form on the right does not work (in progress), but feel free to press the mail button on the bottom of the page.*</p>

            </div>

            <!--=== Contact Form ===-->

            <form id="contact-form" class="col-sm-6 col-md-offset-1 scrollimation fade-left d3" action="contact.php" method="post" novalidate>

                <div class="form-group">
                    <label class="control-label" for="contact-name">Name</label>
                    <div class="controls">
                        <input id="contact-name" name="contactName" placeholder="Your name" class="form-control requiredField" data-new-placeholder="Your name" type="text" data-error-empty="Please enter your name">
                        <i class="fa fa-user"></i>
                    </div>
                </div><!-- End name input -->

                <div class="form-group">
                    <label class="control-label" for="contact-mail">Email</label>
                    <div class=" controls">
                        <input id="contact-mail" name="email" placeholder="Your email" class="form-control requiredField" data-new-placeholder="Your email" type="email" data-error-empty="Please enter your email" data-error-invalid="Invalid email address">
                        <i class="fa fa-envelope"></i>
                    </div>
                </div><!-- End email input -->

                <div class="form-group">
                    <label class="control-label" for="contact-message">Message</label>
                    <div class="controls">
                        <textarea id="contact-message" name="comments" placeholder="Your message" class="form-control requiredField" data-new-placeholder="Your message" rows="6" data-error-empty="Please enter your message"></textarea>
                        <i class="fa fa-comment"></i>
                    </div>
                </div><!-- End textarea -->

                <p><button name="submit" type="submit" class="btn btn-color2 btn-block" data-error-message="Error!" data-sending-message="Sending..." data-ok-message="Message Sent"><i class="fa fa-paper-plane"></i>Send Message</button></p>
                <input type="hidden" name="submitted" id="submitted" value="true" />

            </form><!-- End contact-form -->

        </div>

    </div>

</section>

<!-- ==============================================
MAP
=============================================== -->
<section id="map" style="height: 300px;">

    <div id="gmap" style="height: 300px;"></div>

</section>

<!-- ==============================================
FOOTER
=============================================== -->

<footer id="main-footer" class="add-padding bg-color3 border-top-color2">

    <div class="container">

        <ul class="social-links text-center">
            <li><a href="https://twitter.com/taahachaudhry"><i class="fa fa-twitter fa-fw"></i></a></li>
            <li><a href="https://www.facebook.com/t44h413"><i class="fa fa-facebook fa-fw"></i></a></li>
            <li><a href="mailto:taahac@taahac.me"><i class="fa fa-envelope fa-fw"></i></a></li>
            <li><a href="https://github.com/taahachaudhry"><i class="fa fa-github fa-fw"></i></a></li>
            <li><a href="http://www.linkedin.com/in/taahachaudhry"><i class="fa fa-linkedin fa-fw"></i></a></li>
            <li><a href="http://www.taahac.me"><i class="fa fa-comment fa-fw"></i></a></li>
        </ul>

        <p class="text-center">&copy; 2014 - Taaha Chaudhry</p>
        <p class="text-center">This site was built using JavaScript, jQuery, AngularJS, and C#Asp.NET MVC Web Api</p>

    </div>

</footer>
